const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const {
  CleanWebpackPlugin
} = require('clean-webpack-plugin');
// 在代码发生变化后自动编译代码：

// 1、webpack's Watch Mode
// 2、webpack-dev-server
// 3、webpack-dev-middleware



module.exports = {
  entry: {
    app: './src/index.js',
    print: './src/print.js'
  },
  devtool: 'inline-source-map',
  // 告知 webpack-dev-server，在 localhost:8080 下建立服务，将 dist 目录下的文件，作为可访问文件。
  devServer: {
    contentBase: './dist'
  },
  plugins: [
    // 在watch模式下，CleanWebpackPlugin 里的 cleanStaleWebpackAssets 要设置为 false ，防止监听到改变时把没有改变的文件给清除了
    new CleanWebpackPlugin({
      cleanStaleWebpackAssets: false
    }),
    new HtmlWebpackPlugin({
      title: 'Development'
    })
  ],
  output: {
    filename: '[name].bundle.js',
    path: path.resolve(__dirname, 'dist'),
    publicPath: '/'
  }
};